<template>
  <div class="ProjectProcurement-container">
    <el-col :span="24">
      <el-tabs type="border-card"
               @tab-click="onTabClick"
               v-model="activeName">
        <el-tab-pane label="部件采购"
                     name="one">
          <el-form :model="Form"
                   ref="Form"
                   :inline="true">
            <el-col :span="24">
              <el-col :span="24"
                      class="header-compon-style">
                <el-col :span="10">
                  <el-col :span="24">
                    <el-col :span="10">
                      <ul class="col9-ul-styleNext">
                        <li class="col9-ul-li-style"
                            v-for="(item,index) in Arr"
                            :class="{borderC:index==count}"
                            :key="index"
                            @click="onChangeCount(index,item)">{{item}}</li>
                      </ul>
                    </el-col>
                    <el-col :span="7"
                            class="col7-style">
                      <el-select v-model="Form.majorValue"
                                 placeholder="专业类型"
                                 @change="onChangeType">
                        <el-option v-for="item in majorArr"
                                   :key="item.value"
                                   :label="item.name"
                                   :value="item.value">
                        </el-option>
                      </el-select>
                    </el-col>
                    <el-col :span="7"
                            class="col7-two-style">
                      <el-select v-model="Form.projectStatValue"
                                 style="width:100%;"
                                 placeholder="项目状态"
                                 @change="onChangeStatus">
                        <el-option v-for="item in projectStatArr"
                                   :key="item.value"
                                   :label="item.name"
                                   :value="item.value">
                        </el-option>
                      </el-select>
                    </el-col>
                  </el-col>
                </el-col>
              </el-col>
              <!-- 我要报名弹框 -->
              <el-dialog title="确认报名"
                         :visible.sync="centerDialogVisibleReport"
                         width="30%"
                         :close-on-click-modal="false"
                         :modal-append-to-body="true">
                <span>您确定报名：</span>
                <div style="margin-top:12px;text-align:left;font-size:16px;"><span style="font-size:16px;font-family:MicrosoftYaHei;font-weight:400;color:rgba(51,51,51,1);">{{projectName}}</span>?</div>
                <span slot="footer"
                      class="dialog-footer">
                  <el-button @click="centerDialogVisibleReport = false">取 消</el-button>
                  <el-button type="primary"
                             @click="onConfirmReport">确 定</el-button>
                </span>
              </el-dialog>
              <!-- 已报名后对话框 -->
              <el-dialog title="已报名"
                         :visible.sync="dialogVisible"
                         :close-on-click-modal="false"
                         :modal-append-to-body="true"
                         width="30%">
                <span>您已报名过该项目，可进入顶部【<span style="font-size:16px;font-family:MicrosoftYaHei;font-weight:400;color:rgba(51,51,51,1);">投标管理</span>】进行查看！</span>
                <div class="div-style">
                  <el-button type="primary"
                             @click="onClose">关闭</el-button>
                  <el-button type="primary"
                             @click="onBuyMarket">招标管理</el-button>
                </div>
              </el-dialog>
              <!-- 已结束对话框 -->
              <el-dialog :visible.sync="dialogVisibleEnd"
                         :close-on-click-modal="false"
                         :modal-append-to-body="true"
                         width="25%">
                <div style="text-align:center;">
                  <span>该项目已结束！</span>
                </div>
                <div class="end-dialog-style">
                  <el-button type="primary"
                             @click="onSure">确定</el-button>

                </div>
              </el-dialog>
              <!-- 下面是内容 -->
              <el-col :span="24">
                <ul class="center-content-style">
                  <li v-for="(item,index) in PurchaseArr"
                      :key="index">
                    <el-col :span="24"
                            class="li-style-phuchase">
                      <el-col :span="4"
                              class="col4-one-style">
                        <img :src="item.bid_project.img"
                             class="col4-one-img" />
                      </el-col>
                      <el-col :span="16"
                              class="col16-one-style">
                        <el-col :span="24">
                          <el-col :span="20">
                            <el-col :span="24"
                                    class="col24-one-style">
                              <span :style="{color:item.project_status==3 ? '#BFBFBF' : 'blue'}">【部件采购】</span> <span class="span-one-style"
                                    :style="{color:item.project_status==3?'#BFBFBF':'',fontWeight:item.project_status==3?'':'700'}">{{item.contract_name}}</span>
                            </el-col>
                            <el-col :sapn="24"
                                    style="margin-bottom:26px;">
                              <span class="span-two-style"
                                    :style="{color:item.project_status==3?'#BFBFBF':''}">{{item.company_name}}</span>
                            </el-col>
                            <el-col :span="24">
                              <div> <span class="div-three-style"
                                      :style="{color:item.project_status==3?'#BFBFBF':'',fontWeight:item.project_status==3?'':'700'}">工程量描述：</span><span class="container-describe"
                                      :style="{color:item.project_status==3?'#BFBFBF':''}">{{item.load_info}}</span></div>
                            </el-col>
                            <el-col :span="24"
                                    style="margin-top:10px;">
                              <div> <span class="div-three-style"
                                      :style="{color:item.project_status==3?'#BFBFBF':'',fontWeight:item.status==3?'':'700'}">资质要求：</span>
                                <span style="color:#666666;font-size:14px;
font-family:MicrosoftYaHei-Bold;"
                                      :style="{color:item.project_status==3?'#BFBFBF':''}">{{item.qual_info}}</span> </div>
                            </el-col>
                          </el-col>
                          <el-col :span="4"
                                  class="col4-two-style">
                            &nbsp;
                            <!-- <div class="col4-div-style">招标控制价</div>
                            <div class="col4-div-two-style"> {{item.max_amount}}</div> -->
                          </el-col>
                        </el-col>
                      </el-col>
                      <el-col :span="4"
                              style="position:relative;"
                              class="col4-1-style">
                        <el-col :span="24"
                                style="text-align:right;">
                          <span class="col4-div-style"
                                :style="{color:item.project_status==3?'#BFBFBF':'normal'}">招标控制价</span>
                          <div class="col4-div-two-style"
                               :style="{color:item.project_status==3?'#BFBFBF':'rgba(255, 77, 79, 1)'}"> {{item.max_amount}}<span>万</span></div>
                        </el-col>
                        <el-col :span="24"
                                style="position:absolute;bottom:0px;right:0px;text-align:right;">
                          <el-button :type="item.project_status==1?'primary':'info'"
                                     style="width:60%;"
                                     @click="onSign(item.project_status,item.bid_invite_id,item.contract_name)">{{item.project_status==1?'我要报名':item.project_status==2?'已报名':item.project_status==3?'已结束':''}}</el-button>
                        </el-col>

                      </el-col>
                    </el-col>
                  </li>
                </ul>
                <el-col :span="24"
                        style="padding:20px 0;text-align: center">
                  <el-pagination @size-change="phurHandleSizeChange"
                                 @current-change="phurHandleCurrentChange"
                                 :current-page="phurchPage"
                                 :page-sizes="[4]"
                                 layout="total,sizes,prev, pager, next, jumper"
                                 :total="phurTotal">
                  </el-pagination>
                </el-col>
              </el-col>
            </el-col>
          </el-form>
        </el-tab-pane>
        <el-tab-pane label="招标管理"
                     name="two">
          <seller></seller>
        </el-tab-pane>
        <el-tab-pane label="投标管理"
                     name="three">
          <el-form :model="marketForm"
                   ref="Form"
                   :inline="true">
            <el-col :span="24">
              <el-col :span="24"
                      style="border-bottom:1px solid #E6E6E6;padding-bottom:16px;padding-top:8px;">
                <el-col :span="10">
                  <el-col :span="24">
                    <el-col :span="10">
                      <ul class="col9-ul-next-style">
                        <li class="col9-li-next-style"
                            sortable
                            v-for="(item,index) in marketArr"
                            :class="{borderCM:index==countMark}"
                            :key="index"
                            @click="onChangeMarket(index,item)">{{item}}</li>
                      </ul>
                    </el-col>

                    <el-col :span="7"
                            class="col7-next-style">
                      <el-select v-model="marketForm.marketType"
                                 placeholder="专业类型"
                                 @change="onBuyChangeType">
                        <el-option v-for="item in marketTypeArr"
                                   :key="item.value"
                                   :label="item.name"
                                   :value="item.value">
                        </el-option>
                      </el-select>
                    </el-col>
                    <el-col :span="7"
                            class="col7-nexttwo-style">
                      <el-select v-model="marketForm.marketStatus"
                                 style="width:100%;"
                                 placeholder="投标状态"
                                 @change="onBuyChangeStatus">
                        <el-option v-for="item in marketStatusArr"
                                   :key="item.value"
                                   :label="item.name"
                                   :value="item.value">
                        </el-option>
                      </el-select>
                    </el-col>
                  </el-col>
                </el-col>
              </el-col>
              <!-- 发起投标弹出框 -->
              <el-dialog title="提示"
                         :visible.sync="centerDialogVisibleBid"
                         :close-on-click-modal="false"
                         :modal-append-to-body="true"
                         width="30%"
                         center>
                <div style="text-align:center;">
                  <span>您确定投标<span style="color:blue;">{{buyProjectName}}</span>项目？</span>
                </div>
                <span slot="footer"
                      class="dialog-footer">
                  <el-button @click="centerDialogVisibleBid = false">取 消</el-button>
                  <el-button type="primary"
                             @click="onConfirmBid">确 定</el-button>
                </span>
              </el-dialog>
              <!-- 下面是内容 -->
              <el-col :span="24">
                <ul class="center-container-rightest">
                  <li v-for="(item, index) in buyMarketArr"
                      :key="index">
                    <el-col :span="24"
                            class="li-style">
                      <el-col :span="4"
                              class="col4-height-style">
                        <img :src="item.bid_project.img"
                             class="col4-height-img-style" />
                      </el-col>
                      <el-col :span="16"
                              class="col12-height-style">
                        <el-col :span="24">
                          <el-col :span="20">
                            <el-col :span="24"
                                    style="font-size:16px;font-family:MicrosoftYaHei-Bold;">
                              <span style="color:rgba(20,65,179,1);">【部件采购】</span> <span class="next-span-style">{{item.bid_project.project_name}}</span>
                            </el-col>
                            <el-col :sapn="24"
                                    style="margin-top:12px;">
                              <span class="next-span-two-style">{{item.company_id}}</span>
                            </el-col>
                            <el-col :span="24"
                                    style="margin-top:25px;">
                              <span class="container-describe-top">工程量描述：</span><span class="item-csy-style">{{item.load_info}}</span>
                            </el-col>
                            <el-col :span="24"
                                    style="margin-top:7px;">
                              <div>
                                <span class="request-style">资质要求：</span>
                                <span class="request-item-style">{{item.qual_info}}</span></div>
                            </el-col>
                          </el-col>
                          <el-col :span="4"
                                  class="next-col6-style">
                            &nbsp;
                          </el-col>
                        </el-col>
                      </el-col>
                      <el-col :span="4"
                              class="container-next-col4">
                        <el-col :span="24">

                          <!-- <el-upload action=""
                                     :http-request="uploadFile"
                                     :on-preview="handlePreview"
                                     :on-remove="handleRemove"
                                     :show-file-list="false"
                                     :before-remove="beforeRemove"
                                     multiple
                                     :on-exceed="handleExceed"
                                     :file-list="fileList"
                                     accept=".xls,.xlsx"> -->
                          <el-col :span="24">
                            <div class="next-div-three-style">招标控制价</div>
                            <div class="next-count-two-style"
                                 style="margin-top:7px;"> {{item.max_amount}}<span>万</span></div>
                          </el-col>
                          <el-col :span="24"
                                  style="margin-top:8px;">
                            <!-- <el-upload action=""
                                       :show-file-list="false"
                                       :on-success="handleAvatarSuccess"
                                       :http-request="uploadFile"
                                       multiple
                                       name="excel_file"
                                       accept=".xls,.xlsx"
                                       :file-list="fileList"> -->
                            <el-button type="text"
                                       icon="el-icon-upload2"
                                       size="medium"
                                       @click="onUploadBefore(item.join_bid_id)">上传投标书</el-button>
                            <!-- </el-upload> -->
                          </el-col>

                          <el-col :span="24">
                            <el-button :type="item.bid_join.status==1||item.bid_join.status==2 ? 'primary' : 'info'"
                                       :disabled="item.bid_join.status==1 ||item.bid_join.status==2? false : true"
                                       size="medium"
                                       @click="onBid(item,item.bid_project.project_name)">{{item.bid_join.status==1?'发起投标':item.bid_join.status==2?'已上传标书':item.bid_join.status==3?'已投标':item.bid_join.status==4?'已中标':item.bid_join.status==5?'未中标':''}}</el-button>
                          </el-col>

                          <el-col :span="24"
                                  style="margin-top:7px;">
                            <span class="optionzation-style"
                                  @click="onBidEngineer(item)">查看招标工程量</span>
                            <!--  <el-button type="text"
                                       size="medium"
                                       style="color:#1441B3;"
                                       @click="onBidEngineer(item)">查看招标工程量</el-button> -->
                          </el-col>

                        </el-col>
                      </el-col>
                    </el-col>
                  </li>

                </ul>
                <el-col :span="24"
                        class="col24-end-pagina">
                  <el-pagination @size-change="handleSizeChangeMarket"
                                 @current-change="handleCurrentChangeMarket"
                                 :current-page="currentPageMarket"
                                 :page-sizes="[4]"
                                 layout="total,sizes, prev, pager, next, jumper"
                                 :total="totalMarket">
                  </el-pagination>
                </el-col>
              </el-col>
            </el-col>
          </el-form>
        </el-tab-pane>
      </el-tabs>
    </el-col>
  </div>
</template>
<script>
import axios from 'axios'
import qs from 'qs'
import seller from '../../ResourceManage/PurchaseMarket/Tender'
import { ComponentPurchaseApi } from '@/services/ResourceCentre'//部件采购
import { BiddingManagementApi } from '@/services/ResourceCentre'//投标管理
import { standardCodeApi } from '@/services/StandardCode'

export default {
  components: {
    seller,
  },
  data () {
    return {
      currentPageMarket: 1,
      buyProjectName: '',
      projectName: '',
      centerDialogVisibleReport: false,
      excelFile: '',
      join_bid_id: '',
      PurchaseArr: [],
      buyMarketArr: [],
      field: 'status',
      order: 'ASC',
      //部件采购
      bid_status_orderPurchase: '',
      fieldPurchase: 'bid_num',
      bid_time_orderPurchase: '',
      max_amountPurchase: '',
      orderPurchase: 'ASC',
      // 招标管理获取项目投标数据时传参
      bid_status_order: '',
      bid_time_order: '',
      max_amount: '',
      major_type: '',
      bid_status: '',
      page: 1,
      limit: 4,
      fileList: [{ name: 'food2.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100' }],
      centerDialogVisibleBid: false,
      activeName: 'one',
      dialogVisible: false,
      dialogVisibleEnd: false,
      currentPage: 1,
      pageSize: 10,
      total: 10,
      pageSizeMarket: 4,
      totalMarket: 0,
      count: 0,
      countMark: 0,
      Arr: ['全部', '最新', '价格'],
      marketArr: ['全部', '最新', '价格'],
      Form: {
        majorValue: '',
        projectStatValue: ''
      },
      user_id: this.$route.query.uuid,
      majorArr: [],
      whole: 1,//1:是，2：否
      newest: '',//1:是，2：否
      price: '',//1:是，2：否
      major_type: '',
      project_state: '',
      phurTotal: 0,
      phurchPage: 1,
      phurchPage_size: 4,
      projectStatArr: [],
      marketForm: {
        marketType: '',
        marketStatus: ''
      },
      //招标管理
      marketTypeArr: [],
      marketStatusArr: [],
      pageSizeProject: 10,
      currentPage: 1,
      total: 10,
    }
  },
  methods: {
    onStatusChange (val) {
      console.log('button值改变时触发的事件=', val)
    },
    //分页 --->招标管理
    handleCurrentChangeMarket (page) {
      this.currentPageMarket = page;
      //招标管理--->获取项目投标信息列表
      this.getBidData()
    },
    //页码切换时触发事件--->招标管理
    handleSizeChangeMarket (size) {
      this.pageSizeMarket = size;
      //招标管理--->获取项目投标信息列表
      //this.getBidData()
    },
    //点击“上传图标书”时触发的事件
    onUploadBefore (join_bid_id) {
      this.$message('功能开发中...')
      // this.join_bid_id = join_bid_id;
      // console.log('999999上传前触发的事件值', join_bid_id);
    },
    //上传投标文件
    uploadFile (params) {
      // console.log('params=', params, params.file.name, params.file.size)
      // this.excelFile = params.file.name;
      // const isLt2M = params.file.size / 1024 / 1024 < 2;
      // if (!isLt2M) {
      //   this.$message.error('上传Excel文件大小不能超过 2MB!');
      // } else {
      //   var formData = new FormData();
      //   formData.append("excel_file", params.file);
      // var paper_id = this.$route.query.paper_id;
      // formData.append("paper_id", paper_id);
      // var file_type = 1;
      // var pic_type = 3;
      // formData.append("file_type", file_type);
      // formData.append('pic_type', pic_type);
      // this.axios.post('/adminc/paper/uploadPicFile', formData, {
      //   headers: {
      //     token: getToken(),
      //     sid: getSid(),
      //   }
      // }).then(res => {
      //   if (res.data.code == 90002) {
      //     //this.$message.error('该图片上传失败，请检查网络或是否图片后缀有改动');
      //   } else {
      //     // this.formline.imageUrl = res.data.data.pic_file_url;
      //     // this.formline.pic_one_url1 = res.data.data.pic_file_relative_url;
      //   }

      // }).catch((error) => {
      //   console.log(error);
      // })

      //   this.axios.post('/admin/Bid_att/uploadAtt?join_bid_id=' + this.join_bid_id, {
      //     headers: {
      //       'Content-Type': 'application/json'
      //     }
      //   }).then((res) => {
      //     console.log(res);
      //     //招标管理--->获取项目投标信息列表--->刷新列表数据
      //     this.getBidData();
      //   }).catch((error) => {
      //     console.log(error)
      //   })
      // }
    },
    //上传Excel文件后--->招标管理
    handleAvatarSuccess (res, file) {
      //this.formline.imageUrl = URL.createObjectURL(file.raw);
    },

    //“发起投标”->确定时触发的事件
    onConfirmBid () {
      BiddingManagementApi.getStartBid({
        data: {
          bid_join_id: this.join_bid_id
        }
      }).then((res) => {
        if (res.code == 0) {
          this.$message.success('操作成功!');
          this.centerDialogVisibleBid = false;
          //投标管理--->获取项目投标信息列表---刷新数据
          this.getBidData();
        } else {
          this.$message.error(res.data.msg)
        }
      }).catch((error) => {
        console.log(error)
      })

    },
    //查看投标按钮的事件
    onBidEngineer (item) {
      this.$message('功能开发中...');
      //console.log('项目ID=', item);
      //跳转到工程量管理页面
      //this.$router.push({ path: '/biddingManagement', query: { uuid: this.user_id, project_id: item.project_id } })
    },
    // handleRemove (file, fileList) {
    //   console.log(file, fileList);
    // },
    // handlePreview (file) {
    //   console.log(file);
    // },
    // handleExceed (files, fileList) {
    //   this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
    // },
    // beforeRemove (file, fileList) {
    //   return this.$confirm(`确定移除 ${file.name}？`);
    // },
    //发起投标按钮事件
    onBid (row, project_name) {

      this.join_bid_id = row.bid_join.bid_join_id;
      this.buyProjectName = project_name;
      this.centerDialogVisibleBid = true;
    },
    //点击确定时触发的事件
    onSure () {
      this.dialogVisibleEnd = false;
    },
    //点击全部、最新、价格时触发的事件--->部件采购
    onChangeCount (i, item) {
      this.count = i;
      //field-全部,created_at->最新，max_amount->价格
      if (item == '全部' && this.bid_status_orderPurchase == '') {
        this.fieldPurchase = 'bid_num';
        this.bid_status_orderPurchase = 'DESC';
        this.bid_time_orderPurchase = '';
        this.max_amountPurchase = '';
        this.orderPurchase = this.bid_status_orderPurchase;
      } else if (item == '全部' && this.bid_status_orderPurchase != '') {
        if (this.bid_status_orderPurchase == 'DESC') {
          this.bid_status_orderPurchase = 'ASC';
          this.orderPurchase = this.bid_status_orderPurchase;
        } else {
          this.bid_status_orderPurchase = 'DESC';
          this.orderPurchase = this.bid_status_orderPurchase;
        }
      } else if (item == '最新' && this.bid_time_orderPurchase == '') {
        this.fieldPurchase = 'created_at';
        this.bid_status_orderPurchase == '';
        this.bid_time_orderPurchase = 'DESC';
        this.max_amountPurchase = '';
        this.orderPurchase = this.bid_time_orderPurchase;
      } else if (item == '最新' && this.bid_time_orderPurchase != '') {
        if (this.bid_time_orderPurchase == 'DESC') {
          this.bid_time_orderPurchase = 'ASC';
          this.orderPurchase = this.bid_time_orderPurchase;
        } else {
          this.bid_time_orderPurchase = 'DESC';
          this.orderPurchase = this.bid_time_orderPurchase;
        }
      } else if (item == '价格' && this.max_amountPurchase == '') {
        this.fieldPurchase = 'max_amount';
        this.bid_status_orderPurchase == '';
        this.bid_time_orderPurchase = '';
        this.max_amountPurchase = 'DESC';
        this.orderPurchase = this.max_amountPurchase;
        //console.log('执行', this.order)
      } else if (item == '价格' && this.max_amountPurchase != '') {
        if (this.max_amountPurchase == 'DESC') {
          this.max_amountPurchase = 'ASC';
          this.orderPurchase = this.max_amountPurchase;
        } else {
          this.max_amountPurchase = 'DESC';
          this.orderPurchase = this.max_amountPurchase;
        }
      }
      //获取数据列表--->部件采购
      this.phurchPage = 1;
      this.getPhurData();
      // console.log('whole', this.whole, 'newest', this.newest, 'price', this.price)
    },
    //全部、最新、价格时触发的事件===>招标管理
    onChangeMarket (i, item) {
      this.countMark = i;
      //全部：status  最新：create_time 价格：max_amount
      // bid_status_order: '',
      // bid_time_order: 0,
      // max_amount: 0,
      if (item == '全部' && this.bid_status_order == '') {
        this.field = 'status';
        this.bid_status_order = 'DESC';
        this.bid_time_order = '';
        this.max_amount = '';
        this.order = this.bid_status_order;
      } else if (item == '全部' && this.bid_status_order != '') {
        if (this.bid_status_order == 'DESC') {
          this.bid_status_order = 'ASC';
          this.order = this.bid_status_order;
        } else {
          this.bid_status_order = 'DESC';
          this.order = this.bid_status_order;
        }
      } else if (item == '最新' && this.bid_time_order == '') {
        this.field = 'created_at';
        this.bid_status_order == '';
        this.bid_time_order = 'DESC';
        this.max_amount = '';
        this.order = this.bid_time_order;
      } else if (item == '最新' && this.bid_time_order != '') {
        if (this.bid_time_order == 'DESC') {
          this.bid_time_order = 'ASC';
          this.order = this.bid_time_order;
        } else {
          this.bid_time_order = 'DESC';
          this.order = this.bid_time_order;
        }
      } else if (item == '价格' && this.max_amount == '') {
        this.field = 'max_amount';
        this.bid_status_order == '';
        this.bid_time_order = '';
        this.max_amount = 'DESC';
        this.order = this.max_amount;
        console.log('执行', this.order)
      } else if (item == '价格' && this.max_amount != '') {
        if (this.max_amount == 'DESC') {
          this.max_amount = 'ASC';
          this.order = this.max_amount;
        } else {
          this.max_amount = 'DESC';
          this.order = this.max_amount;
        }
      }


      //从第一页开始查
      this.currentPageMarket = 1;
      //招标管理--->获取项目投标信息列表      
      this.getBidData();
      //order->排序的方式恢复为最初的状态
      //console.log('bid_status_order_全部=', this.bid_status_order, 'bid_time_order_最新=', this.bid_time_order, 'max_amount_价格=', this.max_amount);
    },
    //确定报名按钮触发的事件----->部件采购
    onConfirmReport () {
      ComponentPurchaseApi.onSingUp({
        data: {
          bid_invite_id: this.invite_bid_id
        }
      }).then((res) => {
        if (res.code == 0) {
          this.$message.success('操作成功!');
          this.phurchPage = 1;
          this.centerDialogVisibleReport = false;
          //部件采购->获取数据列表---->刷新
          this.getPhurData();
          //投标管理--->获取项目投标信息列表
          this.getBidData();

        } else {
          this.$message.error(res.data.msg);
        }
      }).catch((error) => {
        console.log(error)
      });
    },
    //点击我要报名时触发的事件====>部件采购
    onSign (project_status, invite_bid_id, contract_name) {
      //1：我要报名；2：已报名；3：已结束
      if (project_status == 1) {
        this.centerDialogVisibleReport = true;
        this.projectName = contract_name;
        this.invite_bid_id = invite_bid_id;
      } else if (project_status == 2) {
        this.dialogVisible = true;
      } else if (project_status == 3) {
        this.dialogVisibleEnd = true;
      }
    },
    //tabs切换时触发的事件
    onTabClick (val) {
      if (val.name == 'three') {
        this.BidDetailStatus = false;
        this.marketStatus = true;
      }
    },
    //关闭事件--->部件采购
    onClose () {
      this.dialogVisible = false;
    },
    //点击招标管理触发的事件===>部件采购
    onBuyMarket () {
      this.dialogVisible = false;
      this.activeName = "three"
    },
    //类型改变时触发的事件---->部件采购
    onChangeType (val) {
      this.major_type = val;
      //全部的时候就传2
      this.whole = 2;
      //部件采购->获取数据列表
      this.phurchPage = 1;
      this.getPhurData();
    },
    //状态改变时触发的事件--->部件采购
    onChangeStatus (val) {
      this.project_state = val;
      //全部的时候就传2
      this.whole = 2;
      //部件采购->获取数据列表      
      this.phurchPage = 1;
      this.getPhurData()
    },
    //切换页码--->部件采购
    phurHandleSizeChange (size) {
      this.phurchPage_size = size;
      this.getPhurData();
    },
    //分页--->部件采购
    phurHandleCurrentChange (curren) {
      this.phurchPage = curren;
      this.getPhurData();
    },
    //专业类型改变时触发的事件---->招标管理
    onBuyChangeType (val) {
      this.major_type = val;
      //从第一页开始查
      this.currentPageMarket = 1;
      //招标管理--->获取项目投标信息列表
      this.getBidData()
    },
    //项目状态改变时触发的事件--->招标管理
    onBuyChangeStatus (val) {
      this.bid_status = val;
      //招标管理--->获取项目投标信息列表
      this.getBidData();
    },
    //部件采购->获取数据列表
    getPhurData () {
      ComponentPurchaseApi.getPurchaseData({
        params: {
          page: this.phurchPage,
          per_page: this.phurchPage_size,//每页显示的条数
          major_type: this.major_type,
          project_state: this.project_state,
          order: this.orderPurchase,
          field: this.fieldPurchase
        }
      }).then((res) => {
        this.PurchaseArr = res.data.data;
        this.phurTotal = Number(res.data.total);
      }).catch((error) => {
        console.log(error)
      })
    },
    //部件采购->获取专业类型数据列表
    getMajorData () {
      standardCodeApi.getStandardCodeData({
        data: {
          code_type: 'major_type'
        }
      }).then((res) => {
        this.majorArr = res.data.list;
        this.majorArr.unshift({ name: '全部类型', value: '' })
        //招标管理->专业类型列表数据
        this.marketTypeArr = res.data.list;
        //招标管理->专业类型列表数据
        this.marketTypeArr = res.data.list;
      }).catch((error) => {
        console.log(error)
      })
    },
    //部件采购->获取项目状态数据下拉列表
    getProjectStatus () {
      standardCodeApi.getStandardCodeData({
        data: {
          code_type: 'projectInviteStatus'
        }
      }).then((res) => {
        if (res.code == 0) {
          //部件采购->项目状态下拉数据
          this.projectStatArr = res.data.list;
          this.projectStatArr.unshift({ name: '全部状态', value: '' });
        }
      }).catch((error) => {
        console.log(error)
      })
    },
    //投标管理--->获取项目投标信息列表
    getBidData () {
      BiddingManagementApi.getBidData({
        params: {
          page: this.currentPageMarket,
          per_page: this.limit,
          major_type: this.major_type,
          join_status: this.bid_status,
          field: this.field,
          order: this.order
        }
      }).then((res) => {
        this.buyMarketArr = res.data.data;
        this.totalMarket = Number(res.data.total);
      }).catch((error) => {
        console.log(error)
      })
    },
    // 投标标准码
    getBidBiaozhui () {
      standardCodeApi.getStandardCodeData({
        data: {
          code_type: 'joinBidStauts'
        }
      }).then((res) => {
        if (res.code == 0) {
          //部件采购->项目状态下拉数据
          this.marketStatusArr = res.data.list;
          this.marketStatusArr.unshift({ name: '全部状态', value: '' })
        }
      }).catch((error) => {
        console.log(error)
      });
    }
  },
  created () {
    if (window.sessionStorage.getItem('access_token')) {
      //部件采购->获取专业类型数据列表----标准码
      this.getMajorData();
      //部件采购->获取项目状态数据下拉列表----标准码
      this.getProjectStatus();
      // 投标标准码
      this.getBidBiaozhui();
      //部件采购->获取数据列表
      this.getPhurData();
      //招标管理->获取项目投标信息列表
      this.getBidData();
    }
  }
}
</script>
<style scoped lang="scss">
.optionzation-style {
  color: #1441b3;
  font-size: 14px;
  cursor: pointer;
  font-family: MicrosoftYaHei;
  font-weight: 500;
  color: rgba(20, 65, 179, 1);
}
::-webkit-scrollbar {
  display: none;
}
.container-next-col4 {
  text-align: right;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.request-item-style {
  font-size: 14px;
  font-family: MicrosoftYaHei;
  color: #666666;
}
.request-style {
  font-size: 14px;
  font-family: MicrosoftYaHei-Bold;
  font-weight: bold;
  color: rgba(51, 51, 51, 1);
  line-height: 21px;
  margin-top: 12px;
}
.item-csy-style {
  font-size: 14px;
  font-family: MicrosoftYaHei;
  color: #666666;
}
.container-describe-top {
  font-size: 14px;
  font-family: MicrosoftYaHei-Bold;
  font-weight: bold;
  color: rgba(51, 51, 51, 1);
  line-height: 21px;
}
.header-compon-style {
  border-bottom: 1px solid #e6e6e6;
  padding-bottom: 16px;
  padding-top: 8px;
}
.center-container-rightest li:nth-child(1) {
  margin-top: -20px !important;
}
/deep/ .el-tabs--border-card > .el-tabs__header {
  background-color: white !important;
  border-bottom: white !important;
  margin: 0;
}
/deep/ .el-tabs--border-card {
  background: #fff;
  border: none !important;
  box-shadow: none !important;
}
/deep/ .el-tabs--border-card > .el-tabs__header .el-tabs__item.is-active {
  color: #409eff;
  background-color: #fff;
  border-right-color: white !important;
  border-left-color: white !important;
  border-bottom: 2px solid #1890ff;
}
/deep/ .el-tabs__nav-scroll {
  overflow: hidden;
  border-bottom: 1px solid #d9d9d9;
}
/deep/ .el-tabs--border-card > .el-tabs__header .el-tabs__item {
  -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
  border: 1px solid transparent;
  margin-top: -1px;
  color: #909399;
  padding: 0px !important;
  text-align: center !important;
  margin: 0px 20px !important;
  height: 60px !important;
  line-height: 60px !important;
}
.container-describe {
  color: #666666;
  font-size: 14px;
  font-family: MicrosoftYaHei-Bold;
}
.container-describe {
  padding-right: 20px;
}
.col9-li-next-style {
  width: 33%;
  text-align: center;
  height: 34px;
  line-height: 34px;
  cursor: pointer;
}
.col9-ul-li-style {
  width: 33%;
  height: 34px;
  line-height: 34px;
  text-align: center;
  cursor: pointer;
  font-size: 14px;
  font-family: MicrosoftYaHei;
  font-weight: 400;
}
.col9-ul-next-style li:nth-child(1) {
  border-left: 1px solid #bfbfbf;
  border-top: 1px solid #bfbfbf;
  border-bottom: 1px solid #bfbfbf;
  border-radius: 4px 0px 0px 4px;
}
.col9-ul-next-style li:nth-child(2) {
  border: 1px solid #bfbfbf;
}
.col9-ul-next-style li:nth-child(3) {
  border-right: 1px solid #bfbfbf;
  border-top: 1px solid #bfbfbf;
  border-bottom: 1px solid #bfbfbf;
  border-radius: 0px 4px 4px 0px;
}
.col7-next-style {
  padding-left: 20px;
}
/deep/ .col7-next-style .el-select .el-input__inner {
  cursor: pointer;
  padding-right: 35px;
  height: 36px;
}
.col7-nexttwo-style {
  padding-left: 20px;
}
/deep/ .col7-nexttwo-style .el-select .el-input__inner {
  cursor: pointer;
  padding-right: 35px;
  height: 36px !important;
}
.col4-height-style {
  height: 150px;
}
.col4-height-img-style {
  width: 100% !important;
  height: 150px !important;
}
.col12-height-style {
  height: 150px;
  padding-left: 20px;
}
.next-span-style {
  font-family: "Arial Negreta", "Arial Normal", "Arial";
  font-weight: 700;
  font-size: 16px;
}
.next-span-two-style {
  font-size: 14px;
  font-family: MicrosoftYaHei;
  font-weight: 400;
  color: rgba(153, 153, 153, 1);
}
.next-div-style {
  font-family: "Arial Negreta", "Arial Normal", "Arial";
  font-weight: 700;
  font-size: 14px;
}
.next-col6-style {
  height: 150px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.next-div-three-style {
  font-size: 14px;
  font-family: MicrosoftYaHei;
  font-weight: 400;
  color: rgba(153, 153, 153, 1);
}
.next-count-two-style {
  font-size: 18px;
  font-family: MicrosoftYaHei-Bold;
  font-weight: bold;
  color: rgba(255, 77, 79, 1);
  word-wrap: break-word;
  word-break: break-all;
  overflow: hidden;
}
.next-img-style {
  padding-top: 21.5px;
}
.col23-style {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  margin-top: 80px;
}
.col24-end {
  padding: 20px 0;
  text-align: center;
}
.table-end-style {
  width: 100%;
  margin-bottom: 20px;
}
.detail-style {
  margin-bottom: 20px;
}
.col24-end-pagina {
  padding: 20px 0;
  text-align: center;
}
.col8-style {
  text-align: center;
}
.col4-two-style {
  height: 150px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.col4-div-style {
  font-size: 14px;
  font-family: MicrosoftYaHei;
  font-weight: 400;
  color: rgba(153, 153, 153, 1);
}
.col4-div-two-style {
  font-size: 24px;
  font-family: MicrosoftYaHei-Bold;
  font-weight: bold;
  color: rgba(255, 77, 79, 1);
  margin-top: 12px;
}
.col4-1-style {
  height: 150px;
}
.col4-img-style {
  padding-top: 21.5px;
}
.col9-ul-next-style {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  height: 40px;
  line-height: 40px;
  font-size: 14px;
  font-family: MicrosoftYaHei;
  font-weight: 400;
  color: rgba(102, 102, 102, 1);
}
.col9-ul-style {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  height: 40px;
  line-height: 40px;
}
.center-content-style li:nth-child(1) {
  margin-top: -20px !important;
}
.col9-ul-styleNext {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  height: 40px;
  line-height: 40px;
}
.col9-ul-li-style {
  width: 33%;
  height: 34px;
  line-height: 34px;
  text-align: center;
  cursor: pointer;
  font-size: 14px;
  font-family: MicrosoftYaHei;
  font-weight: 400;
}
.col9-ul-styleNext li:nth-child(1) {
  border-left: 1px solid #bfbfbf;
  border-top: 1px solid #bfbfbf;
  border-bottom: 1px solid #bfbfbf;
  border-radius: 4px 0px 0px 4px;
}
.col9-ul-styleNext li:nth-child(2) {
  border: 1px solid #bfbfbf;
}
.col9-ul-styleNext li:nth-child(3) {
  border-right: 1px solid #bfbfbf;
  border-top: 1px solid #bfbfbf;
  border-bottom: 1px solid #bfbfbf;
  border-radius: 0px 4px 4px 0px;
}
.col7-style {
  padding-left: 20px;
}
/deep/ .col7-style .el-input--suffix .el-input__inner {
  height: 36px !important;
}
.col7-two-style {
  padding-left: 20px;
}
/deep/ .col7-two-style .el-input--suffix .el-input__inner {
  height: 36px !important;
}
.div-style {
  text-align: center;
  margin-top: 20px;
}
.end-dialog-style {
  text-align: center;
  margin-top: 20px;
}
.div-three-style {
  font-family: "Arial Negreta", "Arial Normal", "Arial";
  font-size: 14px;
}
.col4-one-style {
  height: 150px;
}
.col16-one-style {
  height: 150px;
  padding-left: 20px;
}
.col24-one-style {
  font-size: 16px;
  margin-bottom: 12px;
}
.span-one-style {
  font-family: "Arial Negreta", "Arial Normal", "Arial";
  font-size: 16px;
}
.span-two-style {
  font-size: 14px;
  font-family: MicrosoftYaHei;
  font-weight: 400;
  color: rgba(153, 153, 153, 1);
}
.col4-one-img {
  width: 100% !important;
  height: 150px !important;
}
/deep/ .el-table__body tr.current-row > td {
  background-color: rgba(24, 144, 255, 1);
  color: white;
}
.ProjectProcurement-container {
  padding: 20px;
  padding-top: 0px !important;
}
.li-style {
  margin-top: 40px;
}
.li-style-phuchase {
  margin-top: 40px;
}
.borderC {
  background-color: #1890ff;
  color: white;
}
.borderCM {
  background-color: #1890ff;
  color: white;
}
</style>